<!-- 子组件 -->
 <template>
    <div class="component-2">
        <h2>这是子组件-2</h2>
        <input v-model="value">
    </div>
 </template>
 
 <script lang="ts">
 export default {
   name: '组件-2',
 }
 </script>
<script setup lang="ts">
import { watch } from 'vue';

const value = defineModel()

watch(value, (newValue, oldValue) =>{ 

    console.log('子组件-2的值发生变化了', newValue, oldValue)
})


</script>



 <!-- 样式 -->

<style scoped>
.component-2
{
    width: 100vw;
    height: 100vh;
    background-color: #f0f0f0;
}
</style>